<!doctype html>
<html>

	<head>
		<meta charset="utf-8">
		<title>用户昵称</title>
		<meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
		<link href="css/mui.css" rel="stylesheet" />
		<link rel="stylesheet" type="text/css" href="css/common.css"/>
		<link rel="stylesheet" type="text/css" href="css/index.css"/>
	</head>
	<body >
		<header class="mui-bar mui-bar-nav">
		    <a class="mui-action-back mui-icon mui-icon-left-nav mui-pull-left"></a>
		    <h1 class="mui-title">用户昵称</h1>
		</header>
		<div class="mui-content">
			<div class="bg_ff padding_b30" >
		    <div class="my_top ">
		    	<dl class="clearfix">
		    		<dt class="left relative mg_r10">
		    			<img class="head" src="images/head.png"/>
		    			
		    		</dt>
		    		<dd class="left">
		    			<h5 class="my_name mg_top10">
		    				<span class="name"></span>
		    				<a href="javascript:;" class="gofollow">+关注</a> 
		    			</h5>
		    			<p class="mg_top10 labels"></p>
		    		</dd>
		    	</dl>
		    	
		    </div>
		    <ul class=" myzan bg_ff">
		    	<li>
		    		<p class="color_00 praiseNum"></p>
		    		<p class="color_6">获赞</p>
		    	</li>
		    	<li onclick="fanfouce()">
		    		<p class="color_00 fansNum"></p>
		    		<p class="color_6">粉丝</p>
		    	</li>
		    	<li onclick="fanfouce()">
	    			<p class="color_00 focusNum"></p>
	    		    <p class="color_6 ">关注</p>
		    	</li>
		    </ul>
		    <ul class=" myzan bg_ff other mg_top10">
			    	<li>
			    		<a href="javascript:void(0);" onclick="check()">
			    			<img src="images/yh_sx.png"/>
			    			私信
			    		</a>
			    		
			    	</li>
			    	<li>
			    		<a href="javascript:void(0);">
			    			<img src="images/yh_gz.png"/>
			    			<span class="focusText text-center " style="margin-left: -5px;">关注</span>
			    		</a>
			    	</li>
			    	<li>
			    		<a href="javascript:void(0);" onclick="reportUser()">
				    		<img src="images/yh_jb.png"/>
				    		举报
			    		</a>
			    	</li>
			    </ul>
			</div>    
		    <div class="my_list bg_ff">
		    	<h5 class="color_00 mg_lr10">作品(<span class="num"></span>)</h5>
			   <div class="my_listitem">
		    	<!--<dl class="list_item">
		    			<a href="javascript:void(0);" class="width100">
		    			<dt class="relative">
		    				<img src="images/bg1.png"/>
		    				<p class="absolute list_text mui-ellipsis">文字内容文字内容文字...</p>
		    			</dt>
		    			<dd class="mg_tb10">
		    				<img src="images/headimg.png"/>
		    				昵称1
		    			</dd>
		    			</a>
		    	    </dl>-->
		    	</div>
		    </div>
		</div>
		<p class="text-center mg_tb20"></p>
		
		<script src="js/mui.js"></script>
		<script src="js/jquery-1.7.1.min.js" type="text/javascript" charset="utf-8"></script>
		<script src="js/index.js" type="text/javascript" charset="utf-8"></script>
		<script type="text/javascript">
			mui.init()
			$(".more").click(function(){
				$('.mytop_more').fadeIn(200)
			})
			$('.mytop_more a').click(function(){
				$('.mytop_more').fadeOut(200)
			})
			$(".gofollow").click(function(){
				if($(this).hasClass('ok')){
					
					fouce(2)
				}else{
					
					fouce(1)
				}
			})
			function fanfouce(){
				window.location.href = 'userNickname.html?id='+getUrlParam('workUserId')
			}
			var isFocus=''
//			查看他人主页
		    function getOtherUserInfo(){
		    	$('.gif').show()
				$.ajax({
					type:"post",
					url:urlcom + "userCenter/getOtherUserInfo",
					async:true,
					dataType:'json',
					data:{
						userId:localStorage.getItem('userId'),
						otherUserId:getUrlParam('workUserId')
					},
					success:function(res){
						$('.gif').hide()
						if(res.code==0){
							$('.head').attr('src',res.data.headImg)
							$('.mui-title').html(res.data.name)
							$('.name').html(res.data.name)
							$('.praiseNum').html(res.data.praiseNum)
							$('.fansNum').html(res.data.fansNum)
							$('.focusNum').html(res.data.focusNum)
							$('.labels').html(res.data.labels)
							isFocus = res.data.isFocus
							
							if(res.data.isFocus == 1){
								$('.gofollow').addClass('ok')
								$('.gofollow').html('已关注')
								$('.focusText').html('已关注')
							}else{
								
							}
							
							$('#audio').attr('src',res.data.bgm)
							
							
						}else{
							msg(res.msg)
						}
		 			}
			     })
			}getOtherUserInfo()
			//关注 取消关注
			function fouce(type){
				$.ajax({
					type:"post",
					url:urlcom + "userCenter/focusUser",
					async:true,
					dataType:'json',
					data:{
						userId:localStorage.getItem('userId'),
						focusUserId:getUrlParam('workUserId'),
						type:type
					},
					success:function(res){
						if(res.code==0){
							msg('操作成功')
							getOtherUserInfo()
							console.log(type)
							if(type==1){
								$('.gofollow ').addClass('ok')
					            $('.gofollow ').html('已关注')
					            $('.focusText ').html('已关注')
								
							}else if(type==2){
								$('.gofollow ').removeClass('ok')
					            $('.gofollow ').html('+关注')
					            $('.focusText ').html('关注')
							}
							
						}else{
							msg(res.msg)
						}
		 			}
			     })
			}
			//举报用户
			function reportUser(){
				console.log('举报')
				$('.overlay').show(200)
				$('.vip_mask').fadeIn(200)
				var btnArray = ['取消', '确定'];  
			mui.prompt('','','请输入举报内容',btnArray,function(e){
				if(e.index == 1) {
				    if(e.value) {  
				        $.ajax({
							url:urlcom + "userCenter/reportUser",
							async:true,
							type:"post",
							dataType:'json',
							data:{
								userId:localStorage.getItem('userId'),
								reportUserId:getUrlParam('workUserId'),
								content:e.value
								
							},
							success:function(res){
								if(res.code==0){
									  mui.toast("举报成功");
																
								}else{
									msg(res.msg)
								}
				 			}
					     })
				        
				        
				    } else {  
				        mui.toast("输入值有误，请确认");  
				        return false;  
				    }  
				}
			},'div') 
				
				
			}
			//获取作品列表
			function getWorkByUserId(current){
				$.ajax({
					type:"post",
					url:urlcom + "userCenter/getWorkByUserId",
					async:true,
					dataType:'json',
					data:{
						userId:getUrlParam('workUserId'),
						current:current,
						size:10
					},
					success:function(res){
						if(res.code==0){
							if(res.data.length){
								$('.num').html(res.data.length)
								var html='';
								$.each(res.data, function(k,v) {
									html+='<dl class="list_item">'+
						    			'<a href="detial.html?id='+v.workId+'" class="width100">'+
							    			'<dt class="relative">'+
							    				'<img src="'+v.coverImg+'"/>'+
							    				'<p class="absolute list_text mui-ellipsis">'+v.content+'</p>'+
							    			'</dt>'+
							    			'<dd class="mg_tb10"><img src="images/headimg.png"/>'+v.userName+'</dd>'+
						    			'</a>'+
						    		'</dl>'
								});
								$('.my_listitem').html(html)
							}else{
								$('.num').html('0')
								$('.my_listitem').html('<p class="text-center mg_tb20">暂无作品</p>')
							}
							
							
						}else{
							msg(res.msg)
						}
		 			}
			     })
			}getWorkByUserId(1)
			//判断是否关注私聊
			
			function check(){
					$.ajax({
						url:urlcom + "message/check",
						async:true,
						type:"post",
						dataType:'json',
						data:{
							userId:localStorage.getItem('userId'),
							otherUserId:getUrlParam('workUserId'),
						},
						success:function(res){
							console.log(res.data.isChat)
							if(res.code==0){
								if(res.data.isChat==2){
									// msg('vip就可以私信啦!')
									room()
								}else if(res.data.isChat == 1){
									 window.location.href = 'room.html?id='+getUrlParam('workUserId')+'&&name='+name+'&&head='+head
									
								}
								
								
								
															
							}else{
								msg(res.msg)
							}
						}
					 })
			              
				
			}
			function room(){
				var name = $('.name').html();
				var head = $('.head').attr('src')
				if(isFocus==1){
				    window.location.href = 'room.html?id='+getUrlParam('workUserId')+'&&name='+name+'&&head='+head
				}else if(isFocus==2){
					msg('vip或者关注了就可以私信啦!')
				}
			}
			
		</script>
		
	</body>

</html>
